import 'package:enterprise_v6_app/app/components/common/custom_text_widget.dart';
import 'package:enterprise_v6_app/app/components/custom_app_bar.dart';
import 'package:enterprise_v6_app/app/components/custom_modele/custom_intrinsic_circle_line.dart';
import 'package:enterprise_v6_app/app/core/core.dart';
import 'package:enterprise_v6_app/app/core/ext/widget_extension.dart';

/// 出入记录-详情-个人出入列表
class AssessRecordDetails extends StatelessWidget {
  const AssessRecordDetails({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar(
        titleText: '详情',
      ),
      body: Container(
        color: const Color(0xffF5F5F6),
        child: ListView.builder(
          itemCount: 10,
          itemBuilder: (context, index) {
            return _buildItem(index);
          },
        ),
      ),
    );
  }

  // 列表item
  Widget _buildItem(int index) {
    return Container(
      color: Colors.white,
      padding: EdgeInsets.only(
        left: 20.w,
        right: 20.w,
        top: 16.w,
      ),
      child: CustomIntrinsicCircleLine(
        showWidget: _getTrainView(index),
      ),
    );
  }

  ///获取流程显示
  Widget _getTrainView(int index) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            Text(
              '张三',
              style: TextStyle(
                fontSize: 16.sp,
                fontWeight: FontWeight.w500,
                color: const Color(0xff262F38),
              ),
            ),
            AppGaps.hGap12,
            Text(
              '2021-01-01 12:00:00',
              style: TextStyle(
                fontSize: 14.sp,
                fontWeight: FontWeight.w400,
                color: const Color(0xff495061),
              ),
            ),
            const Spacer(),
            _status(index),
          ],
        ),
        AppGaps.vGap12,
        Container(
          padding: EdgeInsets.all(12.w),
          alignment: Alignment.topLeft,
          decoration: BoxDecoration(
            color: const Color(0xffF7F7FB),
            border: Border.all(
              color: const Color(0xffEBEDF0),
              width: 1.w,
            ),
            borderRadius: BorderRadius.circular(4.r),
          ),
          child: Column(
            children: [
              CustomTextWidget.getTextRowView(title: '通行类型：', value: '进'),
              AppGaps.vGap14,
              CustomTextWidget.getTextRowView(title: '设备名称：', value: '设备1'),
              AppGaps.vGap14,
              CustomTextWidget.getTextRowView(title: '区域位置：', value: '区域1'),
              AppGaps.vGap14,
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '通行抓拍',
                    style: TextStyle(
                      fontSize: 13.sp,
                      height: 1.2,
                      fontWeight: FontWeight.w400,
                      color: const Color(0xffA5A6B5),
                    ),
                  ),
                  AppGaps.hGap10,
                  ClipRRect(
                    borderRadius: BorderRadius.circular(8),
                    child: SizedBox(
                      height: 80,
                      child: Image.network('https://scpic.chinaz.net/files/pic/pic9/202206/apic41264.jpg',fit: BoxFit.cover,),
                    ).clickShowLarge(
                      url: 'https://scpic.chinaz.net/files/pic/pic9/202206/apic41264.jpg',
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
        AppGaps.vGap16,
      ],
    );
  }

  // 状态 1: 正常 2: 已处置
  Widget _status(int i) {
    if (i == 0) {
      return Container(
        padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 8.w),
        decoration: BoxDecoration(
            color: const Color(0xFF5C6DFF),
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(8.r),
              bottomRight: Radius.circular(8.r),
              topRight: Radius.circular(8.r),
            )),
        child: Text('正常',
            style: TextStyle(
              fontSize: 10.sp,
              color: Colors.white,
            )),
      );
    }
    return Container(
      padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 8.w),
      decoration: BoxDecoration(
          color: const Color(0xFFFD6B6B),
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(8.r),
            bottomRight: Radius.circular(8.r),
            topRight: Radius.circular(8.r),
          )),
      child: Text('报警($i)',
          style: TextStyle(
            fontSize: 10.sp,
            color: Colors.white,
          )),
    );
  }
}
